<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <link rel="stylesheet" type="text/css" href="css/blueprint/screen.css" media="screen, projection" />
        <link rel="stylesheet" type="text/css" href="css/main.css" media="screen, projection" />
        <link rel="stylesheet" type="text/css" href="css/blueprint/print.css" media="print" />
        <!--[if IE]>
            <link rel="stylesheet" href="css/blueprint/ie.css" type="text/css" media="screen, projection" />
        <![endif]-->
        <link rel="stylesheet" type="text/css" href="css/menu/style.css" media="screen, projection" />
        <link rel="stylesheet" type="text/css" href="css/table.css" media="screen, projection" />
        <link rel="stylesheet" type="text/css" href="css/message_boxes.css" media="screen, projection" />
        <link rel="stylesheet" type="text/css" href="css/breadcrumb/style.css" media="screen, projection" />
        <link rel="stylesheet" type="text/css" href="css/pagination/style.css" media="screen, projection" />		
        <script type="text/javascript" src="js/vendor/mootools-1.2.2-core-yc.js"></script>
        <script type="text/javascript" src="js/vendor/mootools-1.2.2-more.js"></script>
        <script type="text/javascript" src="js/inputFocus.js"></script>
		
		
        <!-- Effetto mootools accordion per il menu e submenu -->
        <script type="text/javascript" language="JavaScript">
            window.addEvent('domready', function(){
                var accordion = new Accordion('.toggler', '.stretch', {
                    display: -1,
                    alwaysHide: true
                });
            });
        </script>
		<!-- Effetto highlight per la tabella -->
		<script type="text/javascript" language="JavaScript">
			window.addEvent('domready', function(){
				$$('table tr').each(function(el){
					odd = null;
					el.addEvent('mouseenter',function(){
						odd = false;
						if(el.hasClass('odd')){
							el.removeClass('odd');
							odd = true;
						} 
						if(!el.hasClass('highlight')){ 
							el.addClass('highlight'); 
						} 
					});
					el.addEvent('mouseleave',function(){
						if(odd){
							el.addClass('odd');
						}
						if(el.hasClass('highlight')){ 
							el.removeClass('highlight'); 
						} 
					});
				});
			});
		</script>
		
		<!-- Slide per la sezione filtri - ricerca -->
		<script type="text/javascript" language="JavaScript">
			window.addEvent('domready', function(){
				var mySlide = new Fx.Slide('panel-filter');
				mySlide.hide();
				$('filter').addEvent('click', function(e){
					e = new Event(e);
					mySlide.toggle();
					e.stop();
				});
			});
		</script>
		
		<!-- Effect for messagebox -->
		<script type="text/javascript" language="JavaScript">
			window.addEvent('domready', function(){
				var box = $('messagebox');
				
				box.setStyle('opacity','0');
				var myFx = new Fx.Tween(box, {property: 'opacity', duration: 1000})

				$('add').addEvent('click', function() {
					box.addClass('info');
					if(box.style.opacity == 1){
						myFx.start(1,0);
					}
					else{
						box.set('html', 'Save in progress...');
							myFx.start(0,1).chain(function(){
							box.removeClass('info');
							box.addClass('success');
							box.set('html', 'Saved');

							myFx.start(1,0).chain(function(){
								box.removeClass('success');
							});
						});							
					}
				});
			}); 
		</script>

		
        <title>Template admin</title>
    </head>
    <body>
        <div class="container">
            <div id="header" class="span-24 last" style="height:70px;">
                <div class="span-6">
                    <div id="messagebox">
                        Hi I'm message box!!
                    </div>
                </div>
                <div class="span-10">
                    <div id="breadCrumb">
                        <ul>
                            <li>
                                <a href="#">Home >></a>
                            </li>
                            <li>
                                <a href="#">Articles >></a>
                            </li>
                            <li>
                                You are here
                            </li>
                        </ul>
                    </div>
                </div>
				<div class="span-8 last" style="text-align:right">
					<a id="filter" href="#"><img style="margin-top: 10px; margin-right: 10px;" src="css/img/search.png"></a>
					<a id="add" href="#"><img style="margin-top: 10px; margin-right: 10px;" src="css/img/add.png"></a>
					<a href="#"><img style="margin-top: 10px;" src="css/img/logout.png"></a>
				</div>
            </div>
            <div id="menu" class="span-6">
                <img src="css/menu/images/top.png" width="202" height="4" alt="" class="top flt" />
                <div class="menubg flt">
                    <ul class="menu flt">
                        <li class="current_page_item">
                            <a class="level1 toggler" href="#">Gestione prodotti</a>
                        </li>
                        <ul class="stretch">
                            <li>
                                <a class="level2" href="#">Gestione prodotti</a>
                            </li>
                            <li>
                                <a class="level2" href="#">Gestione prodotti</a>
                            </li>
                            <li>
                                <a class="level2" href="#">Gestione prodotti</a>
                            </li>
                        </ul>
                        <li>
                            <a class="level1 toggler" href="#" title="About">Gestione testi</a>
                        </li>
                        <ul class="stretch">
                            <li>
                                <a class="level2" href="#">Gestione testi</a>
                            </li>
                            <li>
                                <a class="level2" href="#">Gestione testi</a>
                            </li>
                            <li>
                                <a class="level2" href="#">Gestione testi</a>
                            </li>
                        </ul>
                        <li>
                            <a class="level1 toggler" href="#" title="Work">Gestioni news</a>
                        </li>
                        <ul class="stretch">
                            <li>
                                <a class="level2" href="#">Gestione news</a>
                            </li>
                            <li>
                                <a class="level2" href="#">Gestione news</a>
                            </li>
                            <li>
                                <a class="level2" href="#">Gestione news</a>
                            </li>
                        </ul>
                        <li class="">
                            <a class="level1" href="#" title="Contact">Preventivi</a>
                        </li>
                        <li class="">
                            <a class="level1" href="#" title="Location">Gestione prodotti</a>
                        </li>
                        <li class="">
                            <a class="level1" href="#" title="13 Styles">Indicizzazione</a>
                        </li>
                    </ul>
                </div>
                <img src="css/menu/images/bot.png" width="202" height="3" alt="" class="bot flt" />
            </div>
            <div id="content" class="span-18 last">
            	<div id="panel-filter" >
					<form action="">
                        <fieldset>
                            <legend>
                                Filter example:
                            </legend>
								<label for="search">Search: </label>
								<input class="text" type="text" /> <br />
																
								<input class="clear button" type="submit" value="Cerca"/>
                        </fieldset>
                    </form> 
					<br />
            	</div>
                <table>
                    <thead>
                        <tr class="odd">
                            <th scope="col" abbr="Codice">
                                Codice
                            </th>
                            <th scope="col" abbr="Home">
                                Nome
                            </th>
                            <th scope="col" abbr="Home Plus">
                                Descrizione
                            </th>
                            <th scope="col" abbr="Business">
                                Up
                            </th>
                            <th scope="col" abbr="Business Plus">
                                Down
                            </th>
                            <th>
                                Pubblica
                            </th>
                            <th scope="col" abbr="Business">
                                Edit
                            </th>
                            <th scope="col" abbr="Business Plus">
                                Delete
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>
                                1
                            </td>
                            <td>
                                Primo prodotto
                            </td>
                            <td>
                                Descrizione del primo prodotto aaa bbb cc ddd eee ddd aaa aaa bbbsdlkj lkjsdfljdsf cxoijvxcoi erlkjdsf oijdfs
                            </td>
                            <td>
                                
                            </td>
                            <td>
                                <a href="#"><img src="css/img/down.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/visible.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/edit.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/delete.png"></a>
                            </td>
                        </tr>
                        <tr class="odd">
                            <td>
                                2
                            </td>
                            <td>
                                Secondo prodotto
                            </td>
                            <td>
                                Descrizione del secondo prodotto
                            </td>
                            <td>
                                <a href="#"><img src="css/img/up.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/down.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/novisible.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/edit.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/delete.png"></a>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                3
                            </td>
                            <td>
                                Terzo prodotto
                            </td>
                            <td>
                                Descrizione del terzo prodotto
                            </td>
                            <td>
                                <a href="#"><img src="css/img/up.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/down.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/visible.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/edit.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/delete.png"></a>
                            </td>
                        </tr>
                        <tr class="odd">
                            <td>
                                4
                            </td>
                            <td>
                                Quarto prodotto
                            </td>
                            <td>
                                Descrizione del quarto prodotto
                            </td>
                            <td>
                                <a href="#"><img src="css/img/up.png"></a>
                            </td>
                            <td>
                     			<a href="#"><img src="css/img/down.png"></a>           
                            </td>
                            <td>
                                <a href="#"><img src="css/img/visible.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/edit.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/delete.png"></a>
                            </td>
                        </tr>
						<tr>
                            <td>
                                5
                            </td>
                            <td>
                                Quinto prodotto
                            </td>
                            <td>
                                Descrizione del quinto prodotto
                            </td>
                            <td>
                                <a href="#"><img src="css/img/up.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/down.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/visible.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/edit.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/delete.png"></a>
                            </td>
                        </tr>
						<tr class="odd">
                            <td>
                                6
                            </td>
                            <td>
                                Sesto prodotto
                            </td>
                            <td>
                                Descrizione del sesto prodotto
                            </td>
                            <td>
                                <a href="#"><img src="css/img/up.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/down.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/visible.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/edit.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/delete.png"></a>
                            </td>
                        </tr>
						<tr>
                            <td>
                                7
                            </td>
                            <td>
                                Settimo prodotto
                            </td>
                            <td>
                                Descrizione del settimo prodotto
                            </td>
                            <td>
                                <a href="#"><img src="css/img/up.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/down.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/visible.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/edit.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/delete.png"></a>
                            </td>
                        </tr>
						<tr class="odd">
                            <td>
                                8
                            </td>
                            <td>
                                Ottavo prodotto
                            </td>
                            <td>
                                Descrizione dell' ottavo prodotto
                            </td>
                            <td>
                                <a href="#"><img src="css/img/up.png"></a>
                            </td>
                            <td>

                            </td>
                            <td>
                                <a href="#"><img src="css/img/visible.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/edit.png"></a>
                            </td>
                            <td>
                                <a href="#"><img src="css/img/delete.png"></a>
                            </td>
                        </tr>

                    </tbody>
                </table>
                <div id="tnt_pagination">
                    <span class="disabled_tnt_pagination">Prev</span>
                    <a href="#1">1</a>
                    <a href="#2">2</a>
                    <a href="#3">3</a>
                    <span class="active_tnt_link">4</span>
                    <a href="#5">5</a>
                    <a href="#6">6</a>
                    <a href="#7">7</a>
                    <a href="#8">8</a>
                    <a href="#9">9</a>
                    <a href="#10">10</a>
                    <a href="#forwaed">Next</a>
                </div>
            </div>
			<div id="footer" class="span-24 last" style="text-align:center;">
            	<p>Powered by Mediavip</p>
        	</div>
        </div>
        
    </body>
</html>
